<template>
	<view class="bg">
		<xl-navbar title="横竖线" fixed shadow></xl-navbar>
		<view class="title">基础样式</view>
		<xl-line></xl-line>
		<view class="title">粗线</view>
		<xl-line :thin="false"></xl-line>
		<view class="title">设置颜色</view>
		<xl-line color="red"></xl-line>
		<view class="title">设置虚线</view>
		<xl-line color="red" dashed></xl-line>
		<view class="title">设置宽度</view>
		<xl-line length="60%"></xl-line>
		<view class="title">设置上下左右边距</view>
		<xl-line length="60%" color="red"></xl-line>
		<xl-line length="60%" color="red" margin="30"></xl-line>
		<xl-line length="60%" color="red"></xl-line>
		<view class="title">设置竖线：需要设置length</view>
		<view class="flex-around" style="padding: 10px 30px 0;">
			<xl-line direction="col" length="30" margin="30" color="red" :thin="false"></xl-line>
			<xl-line direction="col" length="30" margin="30" color="red" :thin="false"></xl-line>
		</view>
	</view>
</template>

<script setup>
	import { ref, onMounted, computed } from "vue";
	
</script>
